/*
 * fsLayui - A Front-end Rapid Development Framework.
 * Copyright (C) 2017-2019 wueasy.com
 * This program is free software: you can redistribute it and/or modify
 * it under the terms of the GNU Affero General Public License as published
 * by the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU Affero General Public License for more details.
 * You should have received a copy of the GNU Affero General Public License
 * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
img{ max-width: 100%; }
.login-back{ position: fixed; left: 0; top: 0; right: 0; bottom: 0; background: #292c33;  z-index: -1; }

.logo{ text-align: center; margin-bottom: 10px; margin-top: 110px; }
.logo-title{ font-size: 38px; color: #fff; text-align: center;  }
.logo-txt{ color: #fff; text-align: center; font-size: 18px; margin-bottom: 30px; }
.login-box{ background: #fff; margin-bottom: 30px; }
.login-tt{ font-size: 30px; color: #333; padding:50px 0 25px 0; text-align: center; }
.login-form{ padding:0 80px; }
.layui-input{ border:none; border-bottom: solid 6px #ccc; font-size: 24px; height: 86px; padding-left: 64px; color: #18a794; }
.login01{ background: url(../images/icon01.png) left center no-repeat; }
.layui-input:focus{ border-color: #18a794!important; }
.login01:focus{ background: url(../images/icon01-1.png) left center no-repeat; }
.login02{ background: url(../images/icon02.png) left center no-repeat; }
.login02:focus{ background: url(../images/icon02-1.png) left center no-repeat; }
.login03{ background: url(../images/icon03.png) left center no-repeat; }
.login03:focus{ background: url(../images/icon03-1.png) left center no-repeat; }
.relative{ position: relative; padding-right: 164px; }
.yzm{ position: absolute; right: 0; top: 50%; margin-top: -26px; cursor: pointer; }
.yzm img{ width: 158px; height: 53px; }
.login-btn{ width: 100%; font-size: 24px; border-radius: 10px; height: 72px; line-height: 72px; margin-top: 54px; }
@media ( min-width: 1280px){
	.layui-container{ max-width: 970px; width: 100%; }

}

	.login-form{ padding:0 40px; }
	.layui-input{ border-bottom: solid 3px #ccc; height: 60px; padding-left: 34px; font-size: 18px;}
	.login01{ background: url(../images/icon01.png) left center no-repeat; background-size: 20px auto; }
	.login01:focus{ background: url(../images/icon01-1.png) left center no-repeat; background-size: 20px auto; }
	.login02{ background: url(../images/icon02.png) left center no-repeat; background-size: 20px auto; }
	.login02:focus{ background: url(../images/icon02-1.png) left center no-repeat; background-size: 20px auto; }
	.login03{ background: url(../images/icon03.png) left center no-repeat; background-size: 22px auto; }
	.login03:focus{ background: url(../images/icon03-1.png) left center no-repeat; background-size: 22px auto; }
	.yzm img{ width: 100px; height: 37px; }
	.yzm{ margin-top: -18px; }
	.relative{ padding-right: 130px; }
	.login-tt{ font-size: 24px;}
	.login-btn{ height: 54px; line-height: 54px; }
	.logo{ margin-top: 30px; }

@media ( max-width: 991px){
	.login-tt{ padding:20px; }
	.login-btn{ height: 46px; line-height: 46px; font-size: 18px; margin-top: 25px; }
}
@media ( max-width: 767px){
	.login-tt{ padding:20px; }
	.login-btn{ height: 46px; line-height: 46px; font-size: 18px; margin-top: 25px; }
	.logo-title{ font-size: 16px; }
	.logo-txt{ font-size: 12px; }
	.login-img{ display: none; }
	.login-form{ padding:0 30px 30px 30px; }
}
